<?xml version="1.0" encoding="UTF-8"?>

<div xmlns="http://www.w3.org/1999/xhtml" component="$model/UI2/system/components/justep/window/window" data-bind="component:{name:'$model/UI2/system/components/justep/window/window'}" __justepbasexid__="__baseID__" components="$model/UI2/system/components/justep/row/row,$model/UI2/system/components/justep/windowDialog/windowDialog,$model/UI2/system/components/justep/model/model,$model/UI2/system/components/justep/window/window,$model/UI2/system/components/justep/titleBar/titleBar,$model/UI2/system/components/justep/wing/child,$model/UI2/system/components/justep/popMenu/popMenu,$model/UI2/system/components/justep/button/button,$model/UI2/system/components/justep/wing/wing,$model/UI2/system/components/justep/menu/menu,">  
  <div xmlns="" component="$model/UI2/system/components/justep/model/model" xid="model" style="display:none" data-bind="component:{name:'$model/UI2/system/components/justep/model/model'}"/>  
  <span xmlns="" component="$model/UI2/system/components/justep/windowDialog/windowDialog" xid="windowDialog" style="left:183px;top:108px;" data-bind="component:{name:'$model/UI2/system/components/justep/windowDialog/windowDialog'}" data-config="{&quot;src&quot;:&quot;$model/UI2/system/components/justep/common/demo/dialog.w&quot;}"> 
    <div xmlns:xhtml="http://www.w3.org/1999/xhtml" class="x-dialog-overlay"></div>  
    <div xmlns:xhtml="http://www.w3.org/1999/xhtml" class="x-dialog">  
      <div class="x-dialog-title"> 
        <button class="close"> 
          <span>×</span> 
        </button>  
        <div class="x-dialog-title-text"/> 
      </div>  
      <div class="x-dialog-body"/> 
    </div> 
  </span>  
  <div xmlns="" component="$model/UI2/system/components/justep/popMenu/popMenu" class="x-popMenu" xid="popMenu" data-bind="component:{name:'$model/UI2/system/components/justep/popMenu/popMenu'}" data-config="{&quot;anchor&quot;:&quot;button7&quot;,&quot;direction&quot;:&quot;right-bottom&quot;}"> 
    <div class="x-popMenu-overlay" xid="div5"/>  
    <ul component="$model/UI2/system/components/justep/menu/menu" class="x-menu dropdown-menu x-popMenu-content" xid="menu1" data-bind="component:{name:'$model/UI2/system/components/justep/menu/menu'}"> 
      <li class="x-menu-item" xid="item1"> 
        <a component="$model/UI2/system/components/justep/button/button" class="btn btn-link" xid="button2" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'},visible:isVisible" data-events="onClick:showWingSource" data-config="{&quot;label&quot;:&quot;源码&quot;}"> 
          <i xid="i2"/>  
          <span xid="span2">源码</span> 
        </a> 
      </li>  
      <li class="x-menu-item" xid="item2"> 
        <a component="$model/UI2/system/components/justep/button/button" class="btn btn-link" xid="button4" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-events="onClick:showJsSource" data-config="{&quot;label&quot;:&quot;js&quot;}"> 
          <i xid="i4"/>  
          <span xid="span4">js</span> 
        </a> 
      </li> 
    </ul> 
  </div>  
  <div xmlns="" component="$model/UI2/system/components/justep/wing/wing" class="x-wing" xid="wing" data-bind="component:{name:'$model/UI2/system/components/justep/wing/wing'}"> 
    <div class="x-wing-left" xid="left1" style="background-color:white;width:40%;" component="$model/UI2/system/components/justep/wing/child" data-bind="component:{name:'$model/UI2/system/components/justep/wing/child'}"> 
      <a component="$model/UI2/system/components/justep/button/button" class="btn btn-default" xid="button1" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-events="onClick:hideLeft" data-config="{&quot;label&quot;:&quot;hide&quot;}"> 
        <i xid="i1"/>  
        <span xid="span1">hide</span> 
      </a>  
      <h2>left page</h2> 
    </div>  
    <div class="x-wing-content" xid="content1" component="$model/UI2/system/components/justep/wing/child" data-bind="component:{name:'$model/UI2/system/components/justep/wing/child'}"> 
      <div class="x-wing-backdrop" xid="div1"/>  
      <div component="$model/UI2/system/components/justep/titleBar/titleBar" class="x-titlebar" xid="titleBar1" data-bind="component:{name:'$model/UI2/system/components/justep/titleBar/titleBar'}" data-config="{&quot;title&quot;:&quot;wing&quot;}"> 
        <div class="x-titlebar-left" xid="div2"> 
          <a component="$model/UI2/system/components/justep/button/button" class="btn btn-link" xid="button5" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-events="onClick:closeWin" data-config="{&quot;icon&quot;:&quot;icon-chevron-left&quot;}"> 
            <i xid="i5" class="icon-chevron-left"/>  
            <span xid="span5"/> 
          </a> 
        </div>  
        <div class="x-titlebar-title" xid="div3">wing</div>  
        <div class="x-titlebar-right " xid="div4"> 
          <div class="empty"/>  
          <a component="$model/UI2/system/components/justep/button/button" class="btn btn-link" xid="button7" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-events="onClick:showMenu" data-config="{&quot;icon&quot;:&quot;icon-android-note&quot;,&quot;label&quot;:&quot;&quot;}"> 
            <i xid="i7" class="icon-android-note"/>  
            <span xid="span7"/> 
          </a> 
        </div> 
      </div>  
      <div component="$model/UI2/system/components/justep/row/row" class="x-row" xid="row1" style="width:100%;" data-bind="component:{name:'$model/UI2/system/components/justep/row/row'}"> 
        <div class="x-col text-center" xid="col2" style="width:30%"> 
          <a component="$model/UI2/system/components/justep/button/button" class="btn btn-link" xid="button1" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-events="onClick:openLeft" data-config="{&quot;label&quot;:&quot;showLeft&quot;}"> 
            <i xid="i1"/>  
            <span xid="span1">showLeft</span> 
          </a> 
        </div>  
        <div class="x-col"> 
          <h3>content page</h3> 
        </div>  
        <div class="x-col text-center" xid="col3" align="right"> 
          <a component="$model/UI2/system/components/justep/button/button" class="btn btn-link" xid="button3" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-events="onClick:showRight" data-config="{&quot;label&quot;:&quot;showRight&quot;}"> 
            <i xid="i3"/>  
            <span xid="span3">showRight</span> 
          </a> 
        </div> 
      </div>  
      <div component="$model/UI2/system/components/justep/row/row" class="x-row" style="width:100%;" data-bind="component:{name:'$model/UI2/system/components/justep/row/row'}"> 
        <div class="x-col"/>  
        <div class="x-col" style="width:30%"> 
          <p>1、容器组件，包含left、content、right三部分</p>  
          <p>2、左滑右滑可打开left、right部分</p>  
          <p>3、点击content部分，关闭打开的侧边部分</p> 
        </div>  
        <div class="x-col"/> 
      </div> 
    </div>  
    <div class="x-wing-right" xid="right1" style="background-color:white;width:40%;" component="$model/UI2/system/components/justep/wing/child" data-bind="component:{name:'$model/UI2/system/components/justep/wing/child'}"> 
      <a component="$model/UI2/system/components/justep/button/button" class="btn btn-default" xid="button1" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-events="onClick:hideRight" data-config="{&quot;label&quot;:&quot;hide&quot;}"> 
        <i xid="i1"/>  
        <span xid="span1">hide</span> 
      </a>  
      <h2>right page</h2> 
    </div> 
  </div> 
</div>
